import { FilledPolygons } from './jsx/allLiveEditors'
import { FilledPolygonsHitmap } from './jsx/allLiveEditors'

# FilledPolygons

`<FilledPolygons />` renders filled, flat polygon shapes. It is used to render filled polygons.

## Props

| Name       | Type              | Default | Description                              |
| ---------- | ----------------- | ------- | ---------------------------------------- |
| `children` | `FilledPolygon[]` | `[]`    | array of FilledPolygon markers to render |

### FilledPolygon

```js
type FilledPolygon = {
  id?: number, // positive integer
  pose: {
    position: { x: number, y: number, z: number },
    orientation: { x: number, y: number, z: number, w: number }
  }
  scale: {
    x: number,
    y: number,
    z: number
  },
  color: {
    r: number, // between 0 and 1
    g: number, // between 0 and 1
    b: number, // between 0 and 1
    a: number, // between 0 and 1
  } | [number, number, number, number],
  points: [{ x: number, y: number, z: number } | [number, number, number]],
}
```

<FilledPolygons />

## Mouse Interaction

<FilledPolygonsHitmap />
